// 引入axios组件
import axios from 'axios';
import qs from 'qs'; // 处理数据  qs.stringify(params)
// 引入公共组件editor
// import UE from '../../components/public/ue.vue';
import { checkRule } from '@/assets/js/public'; // 引入公共js文件
import VueUeditorWrap from 'vue-ueditor-wrap';

export default {
  // ===========================  ueditor  使用代码 start   ================
  // components: {UE},
  components: {
    VueUeditorWrap,
  },
  data() {
    return {
      myConfig: {
        // 如果需要上传功能,找后端小伙伴要服务器接口地址
        // serverUrl: 'http://api.guanchao.site/UEditor/php/controller.php',
        serverUrl: 'http://cli.guanchao.site/UEditor/php/controller.php',
        // 你的UEditor资源存放的路径,相对于打包后的index.html
        UEDITOR_HOME_URL: '/UEditor/',
        // 编辑器不自动被内容撑高
        autoHeightEnabled: false,
        // 初始容器高度
        initialFrameHeight: 500,
        // 初始容器宽度
        initialFrameWidth: '100%',
        // 关闭自动保存
        enableAutoSave: false,
      },
      defaultMsg: '', // 默认显示的文字
      config: {
        initialFrameWidth: 1200,
        initialFrameHeight: 350,
      },
      ue1: 'ue1', // 不同编辑器必须不同的id
      ueState: false, // ue状态
      //= ============================   ueidtor  使用代码  end   ================
      shoptitle: '', // 面包屑导航信息
      shop_name: '', // 商品名称
      shop_num: '', // 商品货号
      cate_id: '', // 一级分类id
      cate_id_two: '', // 二级分类id
      cate_id_three: '', // 三级分类id
      categorylist_one: [], // 一级分类列表
      categorylist_two: [], // 二级分类列表
      categorylist_three: [], // 三级分类列表
      shopdesc: '', // 商品简介
      brandlist: [], // 商品品牌列表
      brand_id: '', // 品牌id
      modellist: [], // 商品模型列表
      model_id: '', // 模型id
      speclist: [], // 产品规格列表
      low_price: '', // 基础售价
      hight_price: '', // 最高售价
      weight: '', // 重量
      postage: '', // 是否包邮
      repertory: '', // 总库存
      shop_introduce: '', // 商品描述
      shop_logo: '', // 详情图片
      shop_desc: '', // 商品详情
      shopid: '', // 商品id，修改时使用
      spec_array: [], // 规格数组
      changestatus: false,
    };
  },
  created() {
    const shopid = this.$route.query.shopid;
    const self = this;
    if (shopid) {
      this.shoptitle = '修改商品';
      self.ueState = false;
    } else {
      this.shoptitle = '添加商品';
      self.ueState = true;
    }
    axios({
      method: 'post',
      url: '/admin/product/productEdit',
      data: { shopid },
    })
      .then((response) => {
        checkRule(response, self); // 检查是否有权限
        self.categorylist_one = response.data.categorylist_one;
        if (shopid) {
          self.categorylist_two = response.data.categorylist_two;
          self.categorylist_three = response.data.categorylist_three;
          self.brandlist = response.data.brandlist;
          self.modellist = response.data.modellist;
          self.spec_array = response.data.spec_array;
          self.speclist = response.data.speclist;
          self.defaultMsg = response.data.shopinfo.shop_desc;
          self.cate_id_two = response.data.shopinfo.cate_id_two;
          self.cate_id_three = response.data.shopinfo.cate_id_three;
          self.cate_id = response.data.shopinfo.cate_id;
          self.shopdesc = response.data.shopinfo.shopdesc;
          self.brand_id = response.data.shopinfo.brand_id;
          self.model_id = response.data.shopinfo.model_id;
          self.shop_name = response.data.shopinfo.shop_name;
          self.shop_num = response.data.shopinfo.shop_num;
          self.low_price = response.data.shopinfo.low_price;
          self.hight_price = response.data.shopinfo.hight_price;
          self.weight = response.data.shopinfo.weight;
          self.postage = response.data.shopinfo.postage;
          self.repertory = response.data.shopinfo.repertory;
          self.shop_introduce = response.data.shopinfo.shop_introduce;
          self.shop_logo = response.data.shopinfo.shop_logo;
          self.ueState = true; // 控制ueditor和select是否加载
          self.shopid = response.data.shopinfo.id;
          console.log(self.spec_array);
          console.log(self.postage);
        }
      })
      .catch((response) => {
        // self.$Message.error('请求失败');
      });
  },
  // 监听函数
  watch: {
    /* cate_id:function(){
        console.log(this.cate_id);
        // 先把当前选的所有值附空
        const self = this;
        self.cate_id_two = '';
        self.model_id = '';
        self.cate_id_three = '';
        self.spec_array = '';
        self.model_id = '';
        self.brand_id = '';
        axios({
          method: "post",
          url: "/admin/product/putCateValue",
          data: {cate_id: this.cate_id}
        })
        .then(function(response) {
            console.log(response);
            self.brandlist = response.data.brandlist;
            self.categorylist_two = response.data.categorylist_two;
            self.modellist = response.data.modellist;
        })
        .catch(function(response) {
            self.$Message.error('请求失败');
        });
      },
      cate_id_two(){
        const self = this;
        axios({
          method: "post",
          url: "/admin/product/putCateValueTwo",
          data: {cate_id_two: this.cate_id_two}
        })
        .then(function(response) {
            console.log(response);
            self.categorylist_three = response.data.categorylist_three;
        })
        .catch(function(response) {
            self.$Message.error('请求失败');
        });
      },
      model_id(){
        const self = this;
        axios({
          method: "post",
          url: "/admin/product/putModelValue",
          data: {model_id: this.model_id}
        })
        .then(function(response) {
          self.speclist = response.data.speclist;
          console.log(response)
          //self.brandlist = response.data.speclist;
            //console.log(self.brandlist);
        })
        .catch(function(response) {
            self.$Message.error('请求失败');
        });
      },// */
  },
  methods: {
    // 一级分类发生变化时,将旗下的所有选项都清空
    changeCateid() {
      console.log(this.cate_id);
      const self = this;
      axios({
        method: 'post',
        url: '/admin/product/putCateValue',
        data: { cate_id: this.cate_id },
      })
        .then((response) => {
          checkRule(response, self); // 检查是否有权限
          if (response.data.brandlist) {
            self.brandlist = response.data.brandlist;
          } else {
            self.brandlist = [];
          }
          if (response.data.categorylist_two) {
            self.categorylist_two = response.data.categorylist_two;
          } else {
            self.categorylist_two = [];
          }
          if (response.data.modellist) {
            self.modellist = response.data.modellist;
          } else {
            self.modellist = [];
          }
          if (self.changestatus) {
            self.cate_id_two = '';
            self.model_id = '';
            self.cate_id_three = '';
            self.spec_array = [];
            self.brand_id = '';
            self.speclist = [];
          }
          self.changestatus = true;
        })
        .catch((response) => {
          // self.$Message.error('请求失败');
        });
    },
    changeCateIdTwo() {
      const self = this;
      axios({
        method: 'post',
        url: '/admin/product/putCateValueTwo',
        data: { cate_id_two: this.cate_id_two },
      })
        .then((response) => {
          checkRule(response, self); // 检查是否有权限
          self.categorylist_three = response.data.categorylist_three;
        })
        .catch((response) => {
          // self.$Message.error('请求失败');
        });
    },
    changeModelid() {
      const self = this;
      axios({
        method: 'post',
        url: '/admin/product/putModelValue',
        data: { model_id: this.model_id },
      })
        .then((response) => {
          checkRule(response, self); // 检查是否有权限
          self.speclist = response.data.speclist;
          // console.log(response)
          // self.brandlist = response.data.speclist;
          // console.log(self.brandlist);
        })
        .catch((response) => {
          // self.$Message.error('请求失败');
        });
    },
    // 图片上传回调钩子方法
    handleSuccess(response) {
      checkRule(response, this); // 检查是否有权限
      if (response.code == 1) {
        this.shop_logo = response.imgpath;
        this.$Message.success('图片上传成功');
      } else {
        this.$Message.error('图片上传失败');
      }
    },
    // ===========================  ueditor  使用代码 start   ================
    // 获取子组件中ueidtor的值（含html标签）
    // ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。
    // 如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例：
    /* getUEContent() {
        let shop_desc = this.$refs.ue.getUEContent(); // 调用子组件方法
        console.log(content)
      },
      // 获取子组件中ueidtor的值（不含html标签）
      getUEContentTxt() {
        let shop_desc = this.$refs.ue.getUEContentTxt(); // 调用子组件方法
        console.log(content)
      },// */
    //= ============================   ueidtor  使用代码  end   ================
    // 商品提交方法
    putArticle() {
      // this.shop_desc = this.$refs.ue.getUEContent(); // 调用子组件方法

      const self = this;
      axios({
        method: 'post',
        url: '/admin/product/productUpdate',
        data: {
          shop_name: self.shop_name,
          shop_num: self.shop_num,
          cate_id: self.cate_id,
          cate_id_two: self.cate_id_two,
          cate_id_three: self.cate_id_three,
          shop_desc: self.defaultMsg,
          low_price: self.low_price,
          hight_price: self.hight_price,
          weight: self.weight,
          postage: self.postage,
          repertory: self.repertory,
          shop_introduce: self.shop_introduce,
          shop_logo: self.shop_logo,
          shopid: self.shopid,
          brand_id: self.brand_id, // 品牌id
          model_id: self.model_id, // 模型id
          shopid: self.shopid, // 商品id，修改时使用
          spec_array: self.spec_array, // 这是一个数组
        },
      })
        .then((response) => {
          checkRule(response, self); // 检查是否有权限
          if (response.data.code == 1) {
            self.$Message.success(response.data.msg);
            self.$router.push({
              path: '/product', // 这是路由名称
            });
          } else {
            self.$Message.error(response.data.msg);
          }
        })
        .catch((response) => {
          // self.$Message.error('请求失败');
        });
    },
  },
};
